<template>
	<el-dialog title="转交下一步" v-model="visible" style="width: 640px !important;" destroy-on-close @closed="$emit('closed')">
		<el-form :model="form" :rules="rules" ref="dialogForm" label-position="left">
			<el-row>
				<el-col :span="8" style="height: 181px;">
					<el-card :header="`备选(`+nextStepList.length+`)`" style="height: 100%">
						<div style="height: 100%;overflow-y: auto;overflow-x:hidden;">
							<el-checkbox-group v-model="selectedStep" @change="checkUpSelectedStep" v-if="bpmStep.concurrentFlag!='0'">
								<el-checkbox :disabled="this.bpmStep.concurrentFlag=='2'" v-for="item in nextStepList" :key="item.stepId" :label="item.stepId" style="width: 100%">{{ item.stepName }}</el-checkbox>
							</el-checkbox-group>
							<el-radio-group v-else v-model="selectedStep" @change="checkUpSelectedStep">
								<el-radio v-for="item in nextStepList" :key="item.stepId" :label="item.stepId" style="width: 100%">{{ item.stepName }}</el-radio>
							</el-radio-group>
						</div>
					</el-card>
				</el-col>
				<el-col :span="16" style="height: 181px;">
					<el-scrollbar>
						<div v-for="item in nextStepList" :key="item.stepId">
							<el-card :header="`【`+item.stepName+`】`" v-if="item.stepType!='end'&&(selectedStep.includes(item.stepId) || bpmStep.concurrentFlag=='2')" style="height: 100%">
								<el-form-item v-if="item.opRule=='0'">
									<template v-slot:label>
										<span style="color: #67C23A;font-size: 16px;font-weight: 600">主办人员</span>
									</template>
									<select-user-for-bpm v-model:accountId="item.opUser" :stepId="item.stepId" :tempOrgId="tempOrgId" :mode="false" :isNotShowBtn="false" :change-user="item.changeUser"/>
								</el-form-item>
								<el-form-item>
									<template v-slot:label>
										<span style="color:#409EFF;font-size: 16px;font-weight: 600">经办人员</span>
									</template>
									<select-user-for-bpm v-model:accountId="item.otherUser" :stepId="item.stepId" :tempOrgId="tempOrgId" :mode="true" :isNotShowBtn="false" :change-user="item.changeUser"/>
								</el-form-item>
							</el-card>
						</div>
						<el-empty v-if="selectedStep.length==0" description="请选择转交步骤" :image-size="50"></el-empty>
						<el-empty v-if="isSelectedEnd" description="当前选择结束结点" :image-size="50"></el-empty>
					</el-scrollbar>
				</el-col>
			</el-row>
			<el-card header="消息提醒" v-if="bpmStep.remindNextUser!='0'||bpmStep.remindCreateUser!='0'||bpmStep.remindParticipant!='0'">
				<msg-box-check-box v-if="bpmStep.remindNextUser!='0'" v-model:msgType="remind.remindNextUser" code="doc-approved" label="提醒审批人"></msg-box-check-box>
				<msg-box-check-box v-if="bpmStep.remindCreateUser!='0'" v-model:msgType="remind.remindCreateUser" code="doc-create" label="提醒创建人"></msg-box-check-box>
				<msg-box-check-box v-if="bpmStep.remindParticipant!='0'" v-model:msgType="remind.remindParticipant" code="doc-join" label="提醒参与人"></msg-box-check-box>
				<el-form-item label="消息内容" v-if="remind.remindNextUser!=''||remind.remindCreateUser!=''||remind.remindParticipant!=''">
					<el-input v-model="form.msgContent" placeholder="消息内容为空时,系统自动生成消息" type="textarea" rows="3" clearable></el-input>
				</el-form-item>
			</el-card>
			<el-card header="公文抄送" v-if="bpmStep.autoSendType=='2'">
				<el-form-item label="人员选择">
					<select-user-dialog v-model:accountId="form.autoSendUser" :mode="true"/>
				</el-form-item>
			</el-card>
		</el-form>
		<template #footer>
			<el-button @click="visible=false">取 消</el-button>
			<el-button type="primary" :loading="isSaveing" @click="submit()">转 交</el-button>
		</template>
	</el-dialog>
</template>

<script>
import selectUserDialog from "@/views/module/selectUserDialog";
import selectUserForBpm from "@/views/module/selectUserForBpm";
import msgBoxCheckBox from "@/views/module/msgBoxCheckBox";
import useTabs from '@/utils/useTabs'
import {isMobile} from "@/utils/util";
export default {
	components: {
		msgBoxCheckBox,
		selectUserDialog,
		selectUserForBpm
	},
	props: {
		tempOrgId: String,
		runId: String,
		flowId: String,
		stepRunId: String,
		bpmStep: Object
	},
	emits: ['success', 'closed'],
	data() {
		return {
			isM:false,
			visible: false,
			isSaveing: false,
			isShowMsg: false,
			isSelectedEnd:false,
			nextStepId: [],
			toStepId: [],
			nextStepList: [],
			selectedStep: [],
			remind: {
				remindNextUser: "",
				remindCreateUser: "",
				remindParticipant: ""
			},
			//表单数据
			form: {
				runId: this.runId,
				flowId: this.flowId,
				stepRunId: this.stepRunId,
				bpmStep: this.bpmStep,
				autoSendUser: "",
				msgContent:""
			},
			//验证规则
			rules: {}
		}
	},
	mounted() {
		this.isM = isMobile();
		this.getBpmNextStep();
	},
	methods: {
		checkUpSelectedStep() {
			if(this.bpmStep.concurrentFlag!='0')
			{
				this.checkUpEndStatus();
			}
		},
		checkUpEndStatus()
		{
			this.isSelectedEnd = false;
			this.nextStepList.forEach(item=>{
				if(item.stepType=="end"&&this.selectedStep.includes(item.stepId))
				{
					this.selectedStep = [item.stepId];
					this.isSelectedEnd = true;
				}
			})
		},
		//显示
		open() {
			this.visible = true;
			return this
		},
		async getBpmNextStep() {
			var res = await this.$API.bpm.bpmStepRun.getNextBpmStep.get({runId: this.runId, currentStepId: this.bpmStep.stepId, stepRunId: this.stepRunId});
			if (res.code == 200) {
				this.nextStepList = res.data;
				if(this.nextStepList.length==1)
				{
					this.selectedStep=this.nextStepList[0].stepId;
				}else
				{
					if (this.bpmStep.concurrentFlag == '2') {
						this.nextStepList.forEach(item => {
							if(item.stepType!="end")
							{
								this.selectedStep.push(item.stepId);
							}
						})
					}
				}
			} else {
				this.$alert(res.message, "提示", {type: 'error'})
			}
		},
		//表单提交方法
		async submit() {
			var nextSteps = [];
			if (this.bpmStep.concurrentFlag == "0") {
				this.nextStepList.forEach(item => {
					if (item.stepId == this.selectedStep) {
						nextSteps.push(item);
					}
				})
			} else if (this.bpmStep.concurrentFlag == "1") {
				this.nextStepList.forEach(item => {
					if (this.selectedStep.includes(item.stepId)) {
						nextSteps.push(item);
					}
				})
			} else {
				nextSteps = this.nextStepList;
			}
			if (this.checkUpParams(nextSteps)) {
				var params = {
					nextStepInfo: JSON.stringify(nextSteps),
					runId: this.form.runId,
					stepRunId: this.form.stepRunId,
					remindNextUser: this.remind.remindNextUser,
					remindCreateUser: this.remind.remindCreateUser,
					remindParticipant: this.remind.remindParticipant,
					msgContent: this.form.msgContent,
					autoSendUser: this.form.autoSendUser
				}
				var res = await this.$API.bpm.bpmStepRun.goNextStep.post(params);
				if (res.code == 200) {
					this.$message.success(res.message)
				} else {
					this.$alert(res.message, "提示", {type: 'error'})
				}
				if(this.isM==true)
				{
					this.$router.replace({
						path: '/app'
					})
				}else {
					useTabs.close();
				}
			}
		},
		setData(data) {

		},
		checkUpParams(nextSteps) {
			if (nextSteps.length == 0) {
				this.$alert("请选择您要转交的步骤！", "提示", {type: 'error'})
				return false;
			} else {
				nextSteps.forEach(item => {
					if(item.stepType!="end")
					{
						if (item.opRule == "0" && item.opUser == "") {
							this.$alert("请选择" + item.stepName + "的主办人员！", "提示", {type: 'error'})
							return false;
						}
						if (item.opRule != "0" && item.otherUser == "") {
							this.$alert("请选择" + item.stepName + "的经办人员！", "提示", {type: 'error'})
							return false;
						}
					}

				})
			}
			return true;
		},
	}
}
</script>

<style scoped>
</style>
